<ion-header>
  <ion-toolbar color="primary">
    <ion-buttons slot="start">
      <ion-menu-button></ion-menu-button>
    </ion-buttons>
    <ion-title>Equipment</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content class="ion-padding">
  <ng-container *ngIf="(gameService.player$ | async) as player">
    <ng-container *ngIf="player.$inventoryData">
      <ion-row *ngFor="let slot of slots" [class.ion-hide]="!player.$inventoryData.equipment[slot] && canHideSlot(slot)">
        <ion-col>
          <app-item [item]="player.$inventoryData.equipment[slot]" 
                    [showLock]="true"
                    [slot]="slot" 
                    (itemMenu)="openItemMenu($event, player.$inventoryData.equipment[slot], slot)"></app-item>
        </ion-col>
      </ion-row>
    </ng-container>
  </ng-container>
</ion-content>
